@layout("/common/_container.html"){
<style>
    input {
        border: 1px solid #a9a9a9;
    }

    input, select {
        border-radius: 3px;
    }

    .ul_li > li, .records > li {
        float: left;
        margin-right: 3%;
    }

    .ul_li label {
        padding-right: 9px;
    }

    .records {
        margin: 0;
    }

    .records > li {
        color: white;
        cursor: pointer;
    }

    .records > li > span {
        font-weight: bold;
    }

    .record_box ul {
        padding: 0;
    }

    .btn_box button {
        margin: 0;
        color: white;
        background: #2eadd0;
        padding: 6px 30px;
        font-size: 1em;
    }

    .choice_btn {
        background: #5e8aa3;
        color: white;
        padding: 3px 10px;
        font-size: 1em;
    }

    .bigSize {
        font-size: 1.2em;
    }

    .selectBox {
        width: 205px;
        height: 39px
    }

    .ul_li ul > li {
        margin-bottom: 15px;
    }
</style>
<div class="ibox float-e-margins ">
    <div class="ibox-content record_box">
        <div style="display: none">
            <input type="hidden" id="id" value="">
            <input type="hidden" id="pageType" value="1">
            <input type="hidden" id="userName" value="${userName}">
            <input type="hidden" id="oneChannelValue" value="">
            <input type="hidden" id="twoChannelValue" value="">
            <input type="hidden" id="thrChannelValue" value="">
        </div>
        <div class="row bigSize">
            <!--input事件-->
            <div class="col-sm-12">
                <ul class="ul_li clearfix">
                    <li>
                        <ul>
                            <li>
                                <label>门诊</label>
                                <select id="outpatientName" name="outpatientName" class="selectBox"
                                        onchange="ReservationsRecordTable.getData()">
                                </select>
                            </li>
                            <li>
                                <label>部门</label>
                                <select id="department" name="department" class="selectBox"
                                        onchange="ReservationsRecordTable.getData()">
                                    <option value="">全部</option>
                                    <option value="网电咨询">网电咨询</option>
                                    <option value="电销咨询">电销咨询</option>
                                    <option value="公共池">公共池</option>
                                    <option value="地推">地推</option>
                                    <option value="新媒体">新媒体</option>
                                    <option value="老带新">老带新</option>
                                    <option value="直接上门">直接上门</option>
                                </select>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <ul>
                            <li>
                                <label>访问病种</label>
                                <select id="accessDisease" name="accessDisease" class="selectBox"
                                        onchange="ReservationsRecordTable.getData()">
                                    <option value="">全部</option>
                                    <option value="种植">种植</option>
                                    <option value="正畸">正畸</option>
                                    <option value="修复">修复</option>
                                    <option value="美白">美白</option>
                                    <option value="拔牙智齿">拔牙智齿</option>
                                    <option value="牙周">牙周</option>
                                    <option value="洗牙洁牙">洗牙洁牙</option>
                                    <option value="医院类">医院类</option>
                                    <option value="儿童齿科">儿童齿科</option>
                                </select>
                            </li>
                            <li>
                                <label>预约项目</label>
                                <select id="appointmentPayService" name="appointmentPayService" class="selectBox"
                                        onchange="ReservationsRecordTable.getData()">
                                </select>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <ul>
                            <li class="clearfix">
                                <label style="margin-top: 3%;">回访状态</label>
                                <select id="statuss" name="statuss" class="selectBox" style="float: right"
                                        onchange="ReservationsRecordTable.getData()">
                                    <option value="">全部</option>
                                    <option value="到店">到店</option>
                                    <option value="预约">预约</option>
                                    <option value="待定">待定</option>
                                    <option value="过期">过期</option>
                                </select>
                            </li>
                            <li>
                                <label>一级渠道</label>
                                <select id="oneChannel" name="oneChannel" class="selectBox"
                                        onchange="ReservationsRecordTable.getData()">
                                </select>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <ul>
                            <li>
                                <label style="text-indent: 1em">建档人</label>
                                <input type="text" id="archiving" style="width: 128px;height: 39px;margin-right: 2px;">
                                <button
                                        type="button" class="btn choice_btn"
                                        onclick="ReservationsRecordTable.getArchiving()"
                                        style="height: 39px;margin: 0;">请选择
                                </button>
                            </li>
                            <li>
                                <label>二级渠道</label>
                                <select id="twoChannel" name="twoChannel" class="selectBox"
                                        onchange="ReservationsRecordTable.getData()">
                                </select>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <ul>
                            <li>
                                <label style="text-indent: 1em">跟进人</label>
                                <input type="text" id="follower" style="width: 128px;height: 39px;margin-right: 2px;">
                                <button
                                        type="button" class="btn choice_btn"
                                        onclick="ReservationsRecordTable.getFollower()" style="height: 39px;margin: 0;">
                                    请选择
                                </button>
                            </li>
                            <li>
                                <label>三级渠道</label>
                                <select id="thrChannel" name="thrChannel" class="selectBox"
                                        onchange="ReservationsRecordTable.getData()">
                                </select>
                            </li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
        <div class="row bigSize" style="margin-bottom: 1%">
            <ul class="ul_li clearfix">
                <li>
                    <label style="text-indent: 1em;">归属人</label>
                    <input type="text" id="belonger" style="width: 128px;height: 39px;margin-right: 2px;">
                    <button
                            type="button" class="btn choice_btn"
                            onclick="ReservationsRecordTable.getBelonger()" style="height: 39px;">请选择
                    </button>
                </li>
                <li>
                    <label>到诊时间</label>
                    <input type="text" id="startFirstVisitDate" style="width: 186px;height: 39px;padding-left: 5px;"
                           onclick="laydate({istiem:true,format:'YYYY-MM-DD hh:mm:ss'})">
                    <span>-</span>
                    <input type="text" id="endFirstVisitDate" style="width: 186px;height: 39px;padding-left: 5px;"
                           onclick="laydate({istiem:true,format:'YYYY-MM-DD hh:mm:ss'})">
                </li>
                <li>
                    <div style="width: 288px;height: 39px;border: 1px solid #cccccc;border-radius: 3px">
                        <span class="glyphicon glyphicon-search" style="padding: 7px 0px 0px 10px;"></span>
                        <input type="text" id="reach" placeholder="姓名/电话/微信/预约号/标识号"
                               style="width: 238px;height: 35px;border: none;float: right;outline:none;margin-top: 1px"
                               onchange="ReservationsRecordTable.search()">
                    </div>
                </li>
                <li class="btn_box" style="float: left">
                    <div style="float: left">
                        <button type="button" class="btn" onclick="ReservationsRecordTable.resetSearch()">重置</button>
                        <button type="button" class="btn" onclick="ReservationsRecordTable.reservationsExport()">导出</button>
                    </div>
                </li>
            </ul>
        </div>
        <div class="row bigSize">
            <div class="col-sm-12" style="background:#3b97d3;;line-height: 46px;">
                <ul class="records clearfix">
                    <li>已到</li>
                    <li onclick="ReservationsRecordTable.today()">今日: <span style="color: #59efe6"
                                                                            id="daozhenToday">0</span></li>
                    <li onclick="ReservationsRecordTable.yesteray()">昨日: <span style="color: #c61839"
                                                                               id="daozhenYesterday">0</span></li>
                    <li onclick="ReservationsRecordTable.thisMonth()">本月: <span style="color: #ecee11"
                                                                                id="daozhenMonth">0</span></li>
                    <li onclick="ReservationsRecordTable.lastMonth()">同比: <span style="color: #bc24c7"
                                                                                id="daozhenLastMonth">0</span></li>

                    <li>成交金额: <span style="color: #bc24c7" id="recordMoney">0</span>元</li>
                </ul>
            </div>
        </div>
        <#table id="ReservationsRecordTable"/>
    </div>
</div>

<script src="${ctxPath}/static/modular/marketing/reservations/reservations_arrive.js"></script>
<script src="${ctxPath}/static/js/common/jsChannel.js"></script>
<script>
    var oneChanneli = document.getElementById("oneChannelValue").value;
    var twoChanneli = document.getElementById("twoChannelValue").value;
    var thrChanneli = document.getElementById("thrChannelValue").value;
    $.post(Feng.ctxPath + "/channel/getChannelsss", function (data) {
        ChannelList = data;
        channelInit('oneChannel', 'twoChannel', 'thrChannel');
    }, "json");

</script>
@}